import { useIntersectionObserver } from '@vueuse/core'
import type {Ref} from "vue";
// import type { App } from 'vue';
// export const viewportIntersection = {
//     install: (app: App) => {
//         app.directive('data-lazy',{
//             mounted(el, binding){
//                 const { stop } = useIntersectionObserver(
//                     el,
//                     ([{ isIntersecting }]) => {
//                         if (isIntersecting) {
//                             console.log('可见')
//                         }else{
//                             console.log('不可见')
//                         }
//                     },
//                 )
//             }
//         })
//     }
// }
export const observeDomAndCallFunction = ( domElement: Ref<HTMLElement | null>, callbackFunction: () => void,) => {
    const { stop } = useIntersectionObserver(
        domElement,
        ([{ isIntersecting }]) => {
            if (isIntersecting) {
                callbackFunction();
                stop();
            }
        },
    )
};
